<template>
  <section class="position">
    <span><h1>招聘系统企业版</h1></span>
    <hr>

    <el-form class="actions" :inline="true" :model="filter" align="right" >
      <el-form-item class="input-title" label="职位名称">
        <el-input
                v-model="filter.pname"
                type="search"
                placeholder="职位名称"
        />
      </el-form-item>

      <el-form-item>
        <el-button @click="filterQuery">
          查询
        </el-button>
      </el-form-item>
    </el-form>
    <hr>

    <a href="#" @click="addPosition">发布新的招聘信息</a>


  <el-table :data="tableData" border style="width: 100%">
    <el-table-column prop="pname" label="职位名称" width="180">
    </el-table-column>
    <el-table-column prop="cname" label="公司名称" width="180">
    </el-table-column>
    <!--<el-table-column prop="minsal" label="最小工资" width="180">
    </el-table-column>-->
    <el-table-column label="职位月薪">
      <template slot-scope="scope">
        {{scope.row.minsal + '-' + scope.row.maxsal}}
      </template>
    </el-table-column>
    <!--<el-table-column prop="maxsal" label="最大工资" width="180">
    </el-table-column>-->
    <el-table-column prop="loc" label="工作地点">
    </el-table-column>
    <el-table-column prop="releasedate" label="发布时间">
    </el-table-column>
    <el-table-column label="操作">
      <template slot-scope="scope">
        <el-button
                size="mini"
                type="danger"
                @click="deletePosition(scope.row)">删除</el-button>
      </template>
    </el-table-column>
  </el-table>

    <el-dialog
            title="提示"
            :visible.sync="dialogVisible"
            width="30%"
    >
      <el-form label-width="80px" :model="formLabelAlign">
        <el-form-item label="职位名称" prop="pname">
          <el-input v-model="formLabelAlign.pname"></el-input>
        </el-form-item>
        <el-form-item label="最低薪水" prop="minsal">
          <el-input v-model="formLabelAlign.minsal"></el-input>
        </el-form-item>
        <el-form-item label="最高薪水" prop="maxsal">
          <el-input v-model="formLabelAlign.maxsal"></el-input>
        </el-form-item>
        <el-form-item label="公司" prop="cid">
          <el-select v-model="formLabelAlign.cid" class="m-2" placeholder="Select">
            <el-option
                    v-for="item in coms"
                    :key="item.cid"
                    :label="item.cname"
                    :value="item.cid"
            />
          </el-select>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="insertPosition">确 定</el-button>
  </span>
    </el-dialog>

  </section>

</template>

<script>
  import {deleteById, findAllPosition, insert} from "@/api/position";
  import {listCom} from "@/api/company";
  import {Message} from "element-ui";

  export default {
    data() {
      return {
        tableData: [],
        dialogVisible:false,
        title:undefined,
        filter:{
          pname:undefined,
        },
        formLabelAlign:{
          pid:undefined,
          cid:undefined,
          cname:undefined,
          pname:undefined,
          minsal:undefined,
          maxsal:undefined,
        },
        coms:[],
      }
    },
    created() {
      this.loadPosition();
      this.queryPosition();
    },
    methods: {
      /*
      * 获取全部员工
      * */
      loadPosition() {
        findAllPosition(this.filter).then(resp => {
          console.log(resp);
          this.tableData = resp.content;
        })
      },
      queryPosition(){
        listCom().then(resp=>{
          this.coms = resp;
        })
      },
      filterQuery() {
        this.loadPosition();
      },
      /*
      * 添加新的招聘信息
      *
      * */
      addPosition() {
        this.title = "发布新的招聘信息"
        this.dialogVisible = true;
        this.formLabelAlign.pname = null;
        this.formLabelAlign.minsal = null;
        this.formLabelAlign.maxsal = null;
        this.formLabelAlign.cid = null;
        this.formLabelAlign.pid = null;
      },
      /*
      * 确定添加
      * */
      insertPosition(){
        insert(this.formLabelAlign).then(resp=>{
          //console.log(this.formLabelAlign.content);
          console.log(resp);
          console.log(this.formLabelAlign);
          if (resp.success){
            this.dialogVisible = false;
            this.loadPosition();
          } else {
            Message.error(resp.message);
          }



        })
      },
      //删除
      deletePosition(row){
          deleteById({pid:row.pid}).then(resp=>{
            this.loadPosition();
          })
      }
    }
  }
</script>